<script setup>
import {DocumentTextOutline} from "@vicons/ionicons5";
import {NButton} from "naive-ui";
import { ref } from "vue";

const actionsCode = ref()
const options = ref([
  {
    label: "打开",
    value: "open",
  },
  {
    label: "其他",
    value: "other"
  }])
const formValue = ref({
  actionsCode:'',
  filePath:''
})

function beforeUpload (UploadFileInfo){
  console.log(UploadFileInfo)
}
</script>

<template>
  <n-form
      ref="formRef"
      :label-width="80"
      :model="formValue"
      size="medium"
  >
    <n-form-item label="行为选择" path="formValue">
      <n-select v-model:value="actionsCode" :options="options" placeholder="请选择" style="width: 120px"/>
    </n-form-item>
    <n-form-item label="选择文件" path="filePath">
      <n-upload
          action=""
          @before-upload=beforeUpload
      >
        <n-button style="width: 50px">
          <n-icon size="20">
            <DocumentTextOutline />
          </n-icon>
        </n-button>
      </n-upload>
    </n-form-item>

  </n-form>
{{formValue.filePath}}

</template>

<style scoped>

</style>
